.feature_container {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 30px auto;
}

.feature {
  background-image: conic-gradient(from 90deg at -10% 100%,#bcc1cd 0deg,#bcc1cd 90deg,#fff 1turn);
}

.cross-platform-container {
  position: relative;
}

.cross-platform-container .cross-img-title {
  position: absolute;
}

[data-theme='dark'] .feature {
  background-image: conic-gradient(from 90deg at -10% 100%,#2b303b 0deg,#2b303b 90deg,#16181d 1turn);
}

[data-theme='dark'] .reverse {
  background-image: conic-gradient(from -90deg at 110% 100%,#2b303b 0deg,#16181d 90deg,#16181d 1turn) !important;
}

.feature_wrapper {
  margin-top: 50px;
  margin-bottom: 50px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  max-width: 56rem;
}

@media (min-width: 1024px) {
  .feature_wrapper {
    margin: 8rem auto;
  }
}

.feature_wrapper .title, .sponsor .title {
  font-size: 40px;
  font-weight: 500;
  margin-bottom: 1.75rem;
}

.feature_wrapper p {
  font-size: 18px;
}

.feature_wrapper img {
  display: block;
  margin: 2rem 0;
}

.feature_wrapper .button_wrapper {
  display: flex;
  margin-top: 2rem;
  justify-content: center;
}

@media (min-width: 1024px) {

  .feature_wrapper .title, .sponsor .title {
    font-size: 52px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    max-width: 36rem;
  }

  .feature_wrapper p {
    font-size: 20px;
  }

  .feature_wrapper img {
    display: block;
    margin: 2rem auto;
  }

  .feature_wrapper .button_wrapper {
    display: flex;
    justify-content: center;
  }
}


.feature_container .reverse {
  grid-template-columns: 40% 1fr;
}

.feature .text {
  order: 0;
  padding-left: 50px;
  padding-right: 120px;
}

.feature .media {
  order: 1;
}

.text .title {
  font-size: var(--font-size-heading-4);
  margin-bottom: 20px;
}

.feature_container .feature .text h3 {
  font-size: var(--font-size-heading-1);
  line-height: 1;
  margin-bottom: var(--spacer-md);
}

.feature_container .feature .text p {
  margin-bottom: var(--spacer-md);
  font-size: var(--font-size-heading-4);;
}

.feature .button_item {
  text-decoration: none;
}

.text-blue {
  color: var(--blue-4)!important;
}
